import React, { PureComponent } from "react"
import Home from "./Home"
import Recommend from "./Recommend"
import Profile from "./Profile"

export class App extends PureComponent {
    constructor() {
        super()
        this.state = {
            message: "Hello World",
            counter: 0,
        }
    }
    changeText() {
        this.setState({
            message: "下雨啦",
        })
    }

    add() {
        this.setState({
            counter: this.state.counter + 1,
        })
    }

    render() {
        const { message, counter } = this.state
        console.log("App render")
        return (
            <div>
                <h2>
                    {message}---{counter}
                </h2>
                <button onClick={() => this.changeText()}>修改文本</button>
                <button onClick={() => this.add()}>counter++</button>
                <Home />
                <Recommend />
                <Profile name={message} />
            </div>
        )
    }
}

export default App
